<title>添加产品</title>
<div class="row">
  <div class="col-xs-12">
    <div class="widget-box">
      <div class="widget-header widget-header-blue widget-header-flat">
        <h4 class="widget-title lighter">添加产品</h4>
      </div>

      <div class="widget-body">
        <div class="widget-main">
          <!-- #section:plugins/fuelux.wizard -->
          <div id="fuelux-wizard-container">
            <div>
              <!-- #section:plugins/fuelux.wizard.steps -->
              <ul class="steps">
                <li data-step="1" class="active">
                  <span class="step">1</span>
                  <span class="title">添加基本信息</span>
                </li>

                <li data-step="2">
                  <span class="step">2</span>
                  <span class="title">添加信息A</span>
                </li>

                <li data-step="3">
                  <span class="step">3</span>
                  <span class="title">添加信息B</span>
                </li>

                <li data-step="4">
                  <span class="step">4</span>
                  <span class="title">添加信息C</span>
                </li>

                <li data-step="5">
                  <span class="step">5</span>
                  <span class="title">添加信息D</span>
                </li>
              </ul>
              <!-- /section:plugins/fuelux.wizard.steps -->
            </div>
            <hr/>

            <!-- #section:plugins/fuelux.wizard.container -->
            <div class="step-content pos-rel">
              <div class="step-pane active" data-step="1">
                <h3 class="lighter block-center green">添加基本信息</h3>
                <form class="form-horizontal" id="validation-form" method="get">
                  <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-3 no-padding-right" for="productName">产品名称</label>
                    <div class="col-xs-12 col-sm-9">
                      <div class="clearfix">
                        <input type="text" name="productName" id="productName" class="col-xs-12 col-sm-6"/>
                      </div>
                    </div>
                  </div>
                  <div class="space-2"></div>

                  <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-3 no-padding-right" for="productType">产品类型</label>
                    <div class="col-xs-12 col-sm-9">
                      <div class="clearfix">
                        <select class="col-xs-12 col-sm-6" id="productType">
                          <option value="0">Alabama</option>
                          <option value="1">Alaska</option>
                        </select>
                      </div>
                    </div>
                  </div>
                  <div class="space-2"></div>

                  <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-3 no-padding-right" for="productPrice">产品价格</label>
                    <div class="col-xs-12 col-sm-9">
                      <div class="clearfix">
                        <input type="number" name="productPrice" id="productPrice" class="col-xs-12 col-sm-6"/>
                      </div>
                    </div>
                  </div>
                  <div class="space-2"></div>

                  <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-3 no-padding-right" for="productSum">产品总数</label>
                    <div class="col-xs-12 col-sm-9">
                      <div class="clearfix">
                        <input type="number" name="productSum" id="productSum" class="col-xs-12 col-sm-6"/>
                      </div>
                    </div>
                  </div>
                  <div class="space-2"></div>

                  <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-3 no-padding-right"
                           for="productRemainNum">产品剩余数量</label>
                    <div class="col-xs-12 col-sm-9">
                      <div class="clearfix">
                        <input type="number" name="productRemainNum" id="productRemainNum" class="col-xs-12 col-sm-6"/>
                      </div>
                    </div>
                  </div>
                  <div class="space-2"></div>


                  <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-3 no-padding-right" for="productStatus">产品状态</label>
                    <div class="col-xs-12 col-sm-9">
                      <div class="clearfix">
                        <select class="col-xs-12 col-sm-6" id="productStatus">
                          <option value="0">Alabama</option>
                          <option value="1">Alaska</option>
                        </select>
                      </div>
                    </div>
                  </div>
                  <div class="form-group">
                    <div class="col-sm-3"></div>
                    <div class="col-xs-12 col-sm-9">
                      <div class="col-sm-6 no-padding">
                        <div class="uploader-container">
                          <!--头部，相册选择和格式选择-->
                          <div class="uploader">
                            <div class="queueList center center-block">
                              <div  class="placeholder dndArea">
                                <img class="mainImg" src=" " alt="">
                              </div>
                              <div class="webuploader-pick" id="webuploader-pick">点击选择主图</div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                </form>
              </div>

              <div class="step-pane" data-step="2">
                <div id="editor" type="text/plain" style="width:100%;height:500px;"></div>
              </div>

              <div class="step-pane" data-step="3">
                <div class="center">
                  <h3 class="blue lighter">This is step 3</h3>
                </div>
              </div>

              <div class="step-pane" data-step="4">
                <div class="center">
                  <h3 class="green">Congrats!</h3>
                  Your product is ready to ship! Click finish to continue!
                </div>
              </div>

              <div class="step-pane" data-step="5">
                <div class="center">
                  <h3 class="green">Congrats!</h3>
                  Your product is ready to ship! Click finish to continue!
                </div>
              </div>

            </div>
            <!-- /section:plugins/fuelux.wizard.container -->
          </div>

          <hr/>
          <div class="wizard-actions center-block center">
            <!-- #section:plugins/fuelux.wizard.buttons -->
            <button class="btn btn-prev">
              <i class="ace-icon fa fa-arrow-left"></i>
              上一步
            </button>

            <button class="btn btn-success btn-next" data-last="Finish">
              下一步
              <i class="ace-icon fa fa-arrow-right icon-on-right"></i>
            </button>

            <!-- /section:plugins/fuelux.wizard.buttons -->
          </div>

          <!-- /section:plugins/fuelux.wizard -->
        </div><!-- /.widget-main -->
      </div><!-- /.widget-body -->
    </div>
    <!-- PAGE CONTENT ENDS -->
  </div><!-- /.col -->
</div><!-- /.row -->

<!-- page specific plugin scripts -->


<script src="../public/javascripts/scripts/product/add.js">
